<template>
  <div class="app-container">
    <div v-show="!assetDetailInfo.visible">
      <!-- 条件栏 -->
      <div class="filter-wrapper">
        <NewPageFilter
          v-model:query="filterInfo.query"
          :filter-list="filterInfo.list"
          :filter-btn="filterInfo.btn"
        >
          <template v-slot:filter-month>
            <el-date-picker
              v-model="month"
              type="monthrange"
              range-separator="至"
              start-placeholder="开始月份"
              end-placeholder="结束月份"
              format="YYYY-MM"
              value-format="YYYY-MM-DD"
            >
            </el-date-picker>
          </template>
        </NewPageFilter>
      </div>
      <div class="filter-wrapper">
        <NewPageFilter :filter-btn="filterInfo.btnList"> </NewPageFilter>
      </div>

      <!-- 表格 -->
      <TableContainer
        :refresh="tableInfo.refresh"
        :init-curpage="tableInfo.initCurpage"
        v-model:data="tableInfo.data"
        :api="tableInfo.api"
        :query="filterInfo.query"
        :checkBox="false"
        :field-list="tableInfo.fieldList"
        @handleEvent="handleEvent"
      >
        <template v-slot:col-assetCode="scope">
          <span
            v-if="scope.row.assetCode"
            class="slip-edit"
            @click="showDetail(scope.row)"
            >{{ scope.row.assetCode }}</span
          >
          <span v-else>-</span>
        </template>
      </TableContainer>
    </div>

    <assetCard-detail
      v-if="assetDetailInfo.visible"
      :id="assetDetailInfo.id"
      v-model:visible="assetDetailInfo.visible"
      @returnBack="getList"
    />
    <PageDialog
      v-show="dialogInfo.visible"
      :title="dialogInfo.title"
      v-model:visible="dialogInfo.visible"
      :width="dialogInfo.width"
      :bt-loading="dialogInfo.btLoading"
      :bt-list="dialogInfo.btList"
    >
      <div class="asset-msg">
        <div class="asset-msg-label">
          <i class="el-icon-warning"></i>{{ dialogInfo.msg }}：
        </div>
        <el-radio-group v-model="dialogInfo.flag">
          <el-radio label="page">当前页数据</el-radio>
          <el-radio label="all">全部页数据</el-radio>
        </el-radio-group>
      </div>
    </PageDialog>
  </div>
</template>

<script setup name="assetMonthIncomeApplyDeptCostQuery">
import {
  getAssetMonthIncomeApplyDeptCostQueryPage,
  excelAssetMonthIncomeApplyDeptCostQuery,
} from '@/api/dataQuery.js'
import AssetCardDetail from '@/views/asset/assetManage/assetCard/details'
import moment from "moment"
import { getSupplierAll, getDeptAll } from '@/api/core'

const { proxy } = getCurrentInstance()

const month = ref([`${moment().format('YYYY-MM')}-01`, `${moment().format('YYYY-MM')}-01`])
const dialogInfo = ref({
  visible: false,
  title: '提示',
  btLoading: false,
  type: '',
  msg: '',
  width: '400px',
  flag: 'page',
  btList: [
    { label: '关闭', event: handleClose, show: true },
    {
      label: '导出',
      type: 'primary',
      event: checkConfirm,
      show: true,
    },
  ],
})
// 过滤相关配置
const filterInfo = ref({
  query: {
    sort: 'create_time desc',
    // deptAuth: 'id',
    // supplierAuth: 'supplierId',
    // depotAuth: 'id',
  },
  copyQuery: {},
  list: [
    {
      slot: 'true',
      label: '月份',
      value: 'month',
      event: search,
    },

    {
      componentType: 'input',
      label: '资产卡片号',
      value: 'assetCodeLike',
      event: search,
    },
    {
      componentType: 'input',
      label: '资产名称',
      value: 'assetNameLike',
      event: search,
    },
    {
      componentType: 'input',
      label: '厂家名称',
      value: 'brandNameLike',
      event: search,
    },
    {
      label: '供应商',
      value: 'supplierIdMult',
      componentType: 'slip-select',
      api: getSupplierAll,
      query: {
        //  supplierAuth: 'supplierId',
        sort: 'create_time desc',
      },
      clearable: true,
      keyField: 'supplierName',
      valueField: 'supplierId',
      multiple: true,
      event: search,
    },
    {
      label: '使用部门',
      value: 'useDeptIdMult',
      query: {
        // deptAuth: 'id',
        status: 1,
      },
      api: getDeptAll,
      componentType: 'slip-select',
      multiple: true,
      event: search,
    },
    {
      label: '管理部门',
      value: 'manageDeptIdMult',
      query: {
        // deptAuth: 'id',
        status: 1,
      },
      api: getDeptAll,
      componentType: 'slip-select',
      multiple: true,
      event: search,
    },
    {
      label: '开单部门',
      value: 'applyDeptIdMult',
      query: {
        // deptAuth: 'id',
        status: 1,
      },
      api: getDeptAll,
      componentType: 'slip-select',
      multiple: true,
      event: search,
    },
  ],
  btn: [
    { type: 'button', label: '搜索', event: search },
    { type: 'button', label: '重置', event: clearSearch },
  ],
  btnList: [
    {
      type: 'button',
      label: '导出excel',
      event: exportExcel,
      show: proxy.$permission('assetMonthIncomeApplyDeptCostQuery:exportExcel'),
    },
  ],
})
// 表格相关
const tableInfo = ref({
  refresh: 1,
  initCurpage: 1,
  api: null,
  data: [],
  selections: [],
  fieldList: [
    {
      label: '月份',
      value: 'month',
    },
    {
      label: '资产名称',
      value: 'assetName',
    },
    {
      label: '资产卡片号',
      value: 'assetCode',
      type: 'slot',
    },
    { label: '规格', value: 'standard' },
    { label: '厂家', value: 'brandName' },
    { label: '供应商', value: 'supplierName' },
    { label: '开单部门', value: 'applyDeptName' },
    { label: '使用部门', value: 'useDeptName' },
    { label: '管理部门', value: 'manageDeptName' },
    { label: '位置', value: 'location' },
    { label: '设备购入金额(元)', value: 'primitiveOriginalAmount' },
    { label: '本月预计收入(元)', value: 'estimateTreatIncome' },

    { label: '本月全院实际收入(元)', value: 'incomeAmount' },
    { label: '开单部门实际收入(元)', value: 'applyDeptIncomeAmount' },
    { label: '开单部门实际收入所占比例(%)', value: 'applyDeptIncomeRate' },
    { label: '预计检查(治疗)人次', value: 'estimateTreatPersonTime' },
    { label: '全院实际检查(治疗)人次', value: 'treatPersonTime' },
    { label: '开单部门实际检查(治疗)人次', value: 'applyDeptTreatPersonTime' },
    {
      label: '开单部门实际检查(治疗)人次所占比例(%)',
      value: 'applyDeptTreatPersonTimeRate',
    },
    {
      label: '全院阳性人次',
      value: 'positivePersonTime',
    },
    {
      label: '开单部门阳性人次',
      value: 'applyDeptPositivePersonTime',
    },
    { label: '阳性率(%)', value: 'positiveRate' },
    {
      label: '开单部门所占阳性率(%)',
      value: 'applyDeptPositiveRate',
    },
  ],
  // handle: {
  //   fixed: 'right',
  //   label: '操作',
  //   width: '100',
  //   btList: [
  //     {
  //       label: '详情',
  //       event: toDetails,
  //       show: proxy.$permission('assetMonthIncomeApplyDeptCostQuery:details'),
  //     },
  //   ],
  // },
})
const assetDetailInfo = ref({
  visible: false,
  id: '',
})
const page = ref({
  page: true,
  curPage: 1, // 当前页
  pageSize: 20, // 每页条数
})
const toPage = computed(() => {
  return proxy.$store.state.settings.toPage
})
let stopWatch = function () {}
onActivated(() => {
  stopWatch = watch(
    () => toPage.value,
    (val) => {
      if (val) {
        let menus = proxy.$store.state.permission.defaultMenus
        menus.forEach((item) => {
          if (item.children) {
            item.children.forEach((el) => {
              if (
                el.code === 'assetMonthIncomeApplyDeptCostQuery' &&
                el.url === val.url
              ) {
                if (val.urlType === 1) {
                  getList()
                }
                proxy.$store.dispatch('settings/toPage', '')
              }
            })
          }
        })
      }
    },
    {
      deep: true,
      immediate: true,
    }
  )
})
onDeactivated(() => {
  stopWatch()
})
onMounted(() => {
  filterInfo.value.copyQuery = proxy.$fn.deepClone(filterInfo.value.query)
  getList()
})

function handleClose() {
  dialogInfo.value.visible = false
}
function checkConfirm() {
  exportExcelList()
  dialogInfo.value.visible = false
  dialogInfo.value.msg = ''
}
function exportExcel() {
  dialogInfo.value.visible = true
  dialogInfo.value.type = 'excel'
  dialogInfo.value.msg = '请选择数据导出范围'
  dialogInfo.value.btList[1].label = '导出'
  dialogInfo.value.flag = 'page'
}
function exportExcelList() {
  filterInfo.value.query.idMult = ''
  if (dialogInfo.value.flag === 'select') {
    if (!tableInfo.value.selections.length) {
      Message.warning({
        message: '请选择数据！',
        showClose: true,
        duration: 3000,
      })
      return
    }
    let ids = tableInfo.value.selections.map((item) => item.id).join(',')
    filterInfo.value.query.idMult = ids
  }
  let params = {
    ...filterInfo.value.query,
    ...page.value,
    isPagerByExport: dialogInfo.value.flag === 'page' ? true : false,
  }
  excelAssetMonthIncomeApplyDeptCostQuery(params).then((resp) => {
    if (resp) {
      proxy.$fn.parseExcel(resp)
    }
  })
}

// 获取列表
function getList() {
  if (month.value && month.value.length) {
    filterInfo.value.query.businessDateGreater = month.value[0]
    filterInfo.value.query.businessDateLess =
      month.value[1].split('-')[0] + '-' + month.value[1].split('-')[1] + '-31'
  } else {
    filterInfo.value.query.businessDateGreater = ''
    filterInfo.value.query.businessDateLess = ''
    month.value = []
    proxy.$message({
      message: `请选择月份`,
      type: 'warning',
      duration: 3500,
      showClose: true,
    })
    return
  }
  tableInfo.value.api = getAssetMonthIncomeApplyDeptCostQueryPage
  tableInfo.value.refresh = Math.random()
}
function clearSearch() {
  filterInfo.value.query = proxy.$fn.deepClone(filterInfo.value.copyQuery)
  month.value = [`${moment().format('YYYY-MM')}-01`, `${moment().format('YYYY-MM')}-01`]
  search()
}
// 搜索
function search() {
  // 重置分页
  if (month.value && month.value.length) {
    filterInfo.value.query.businessDateGreater = month.value[0]
    filterInfo.value.query.businessDateLess =
      month.value[1].split('-')[0] + '-' + month.value[1].split('-')[1] + '-31'
  } else {
    filterInfo.value.query.businessDateGreater = ''
    filterInfo.value.query.businessDateLess = ''
    month.value = []
    proxy.$message({
      message: `请选择月份`,
      type: 'warning',
      duration: 3500,
      showClose: true,
    })
    return
  }
  tableInfo.value.api = getAssetMonthIncomeApplyDeptCostQueryPage
  tableInfo.value.initCurpage = Math.random()
  tableInfo.value.refresh = Math.random()
}

// 触发事件
function handleEvent(event, data) {
  switch (event) {
    case 'tableCheck':
      tableInfo.value.selections = [...data]
      break
  }
}

//跳转资产卡片详情
function showDetail(row) {
  if (row.assetId && row.assetId !== -2) {
    assetDetailInfo.value.id = row.assetId
    assetDetailInfo.value.visible = true
  }
}
// function toDetails(row) {
//   //跳转到收支明细列表
//   proxy.$router.push({
//     name: 'incomeCost',
//     params: {
//       query: JSON.stringify({
//         assetId: row.assetId,
//         businessDateGreater: row.month + '-01',
//         businessDateLess: row.month + '-31',
//         assetCode: row.assetCode,
//         applyDeptId: row.applyDeptId,
//       }),
//     },
//   })
// }
</script>
<style scoped></style>
